export default {
  created() {
    this.getRolesData();
  },
  data() {
    return {
      // 角色列表数据
      rolesList: [],
      //   添加角色对话框
      addDialogVisible: false,
      addRolesForm: {
        roleName: "",
        roleDesc: ""
      },
      rules: {
        roleName: [
          { required: true, message: "请输入角色名称", trigger: "blur" }
        ]
      },
      // 编辑角色数据
      editDialogVisible: false,
      editRolesForm: {
        roleId: null,
        roleName: "",
        roleDesc: ""
      },
      // 分配权限数据
      disRightsDialog: false,
      rightsTreeData: [],
      defaultProps: {
        children: "children",
        label: "authName"
      },
      checkedIdArr: [],
      rightsRoleId: null
    };
  },
  methods: {
    //   获取数据
    async getRolesData() {
      const {
        data: { data, meta }
      } = await this.$http.get("roles");

      if (meta.status !== 200) return this.$message.error(meta.msg);
      this.rolesList = data;
    },
    // 打开添加角色对话框
    openAddDialogVisible() {
      this.addDialogVisible = true;
      // 重置表单
      this.$nextTick(() => {
        this.$refs.addRolesForm.resetFields();
      });
    },
    // 添加角色
    addRoles() {
      // 对整个表单进项校验
      this.$refs.addRolesForm.validate(async valid => {
        if (valid) {
          const {
            data: { meta }
          } = await this.$http.post("/roles", this.addRolesForm);
          if (meta.status !== 201) return this.$message.error(meta.msg);
          this.getRolesData();
          this.addDialogVisible = false;
        }
      });
    },
    // 删除角色
    async delRoles(id) {
      this.$confirm("亲，是否删除该角色?", "温馨提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          const {
            data: { meta }
          } = await this.$http.delete(`roles/${id}`);
          if (meta.status !== 200) return this.$message.error(meta.msg);
          this.$message.success(meta.msg);
          this.getRolesData();
        })
        .catch(() => null);
    },
    // 打开编辑角色对话框
    openEditDialogVisible(row) {
      this.editDialogVisible = true;
      this.$nextTick(() => {
        // 重置表单
        this.$refs.editRolesForm.resetFields();
        // 填充数据
        this.editRolesForm.roleId = row.id;
        this.editRolesForm.roleName = row.roleName;
        this.editRolesForm.roleDesc = row.roleDesc;
      });
    },
    // 编辑角色
    async editRoles() {
      const {
        data: { meta }
      } = await this.$http.put(`roles/${this.editRolesForm.roleId}`, {
        roleName: this.editRolesForm.roleName,
        roleDesc: this.editRolesForm.roleDesc
      });
      if (meta.status !== 200) return this.$message.error(meta.msg);
      this.$message.success(meta.msg);
      this.getRolesData();
      this.editDialogVisible = false;
    },
    // 删除单个权限
    async delRights(row, rightdId) {
      this.$confirm("亲，是否删除该角色?", "温馨提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning"
      })
        .then(async () => {
          const {
            data: { data, meta }
          } = await this.$http.delete(`roles/${row.id}/rights/${rightdId}`);
          if (meta.status !== 200) return this.$message.error(meta.msg);
          // 返回当前角色拥有的全部权限
          row.children = data;
        })
        .catch(() => null);
    },
    // 打开分配权限对话框,获取权限数据
    async openDisRightsDialog(row) {
      const {
        data: { data, meta }
      } = await this.$http.get(`rights/tree`);
      if (meta.status !== 200) return this.$message.error(meta.msg);
      // 把返回的数据赋值给树状结构的绑定数据
      this.rightsTreeData = data;

      // 打开对话框时，需要获取当前角色选中的权限Id，并赋值给default-checked-keys
      let arr = [];
      // 只需要第三级的权限Id
      row.children.forEach(item => {
        item.children.forEach(subItem => {
          subItem.children.forEach(lastItem => {
            arr.push(lastItem.id);
          });
        });
      });

      this.checkedIdArr = arr;

      this.rightsRoleId = row.id;
      // 打开对话框
      this.disRightsDialog = true;
    },
    // 提交分配权限
    async disRighs() {
      // 获取全选的角色ID数组
      const checkedArr = this.$refs.rightsTree.getCheckedKeys();
      // 获取半选的角色ID数组
      const haifCheckedArr = this.$refs.rightsTree.getHalfCheckedNodes();
      // 合并两个数组
      const arr = [...checkedArr, ...haifCheckedArr];
      // 发送请求
      const {
        data: { meta }
      } = await this.$http.post(`roles/${this.rightsRoleId}/rights`, {
        rids: arr.join(",")
      });
      if (meta.status !== 200) return this.$message.error(meta.msg);
      this.getRolesData();
      this.$message.success(meta.msg);
      this.disRightsDialog = false;
    }
  }
};
